import { createRouter, createWebHashHistory } from "vue-router";

// 1.引入页面
// const Home = () =>import("@/views/Home.vue")
import Layout from '@/layout/Index.vue'

import store from "@/store"
import { menuTree } from "@/apis/personal"

const Login = () => import("@/views/login/Index.vue")
const PersonalIndex = () => import("@/views/personal/Index.vue")
const PersonalMessage = () => import("@/views/personal/Message.vue")

// 应用管理
const AppDept = () => import("@/views/app/Dept.vue")
const AppResource = () => import("@/views/app/Resource.vue")
const AppRole = () => import("@/views/app/Role.vue")
const AppUser = () => import("@/views/app/User.vue")

// 系统管理
const SysUser = () => import("@/views/sys/User.vue")
const SysNotice = () => import("@/views/sys/Notice.vue")

// 审计管理
const LogsVisit = () => import("@/views/logs/Visit.vue")
const LogsOperation = () => import("@/views/logs/Operation.vue")

const NotFound = () => import("@/views/404.vue")

// 2.路由配置
const routes = [
    // {
    //     path:'/',
    //     component:Home
    // }
    {
        path: '/',
        name: 'Home',
        component: Layout,
        children: [
            // 登录页
            {
                path: 'login',
                name: 'Login',
                component: Login
            },
            // 个人中心页
            {
                path: 'personal',
                name: 'Personal',
                component: PersonalIndex,
                children: [
                    {
                        path: 'personal',
                        name: 'PersonalMessage',
                        component: PersonalMessage,
                    }
                ]
            },
            // App内部页
            {
                path: '/app',
                name: 'App',
                children: [
                    {
                        path: 'user',
                        name: 'AppUser',
                        component: AppUser
                    },
                    {
                        path: 'dept',
                        name: 'AppDept',
                        component: AppDept
                    },
                    {
                        path: 'role',
                        name: 'AppRole',
                        component: AppRole
                    },
                    {
                        path: 'resource',
                        name: 'AppResource',
                        component: AppResource
                    },
                ]
            },
            // sys页
            {
                path: '/sys',
                name: 'Sys',
                children: [
                    {
                        path: 'user',
                        name: 'SysUser',
                        component: SysUser
                    },
                    {
                        path: 'notice',
                        name: 'SysNotice',
                        component: SysNotice
                    },
                ]
            },
            // logs页
            {
                path: '/logs',
                name: 'Logs',
                children: [
                    {
                        path: 'visit',
                        name: 'LogsVisit',
                        component: LogsVisit
                    },
                    {
                        path: 'operation',
                        name: 'LogsOperation',
                        component: LogsOperation
                    },
                ]
            },

            // 404
            {
                path: '404',
                name: 'NotFound',
                component: NotFound
            }
        ]
    },
    {
        path: '/:pathMatch(.*)*',
        name: '404',
        redirect: '/404'
    }
]
// 3.路由初始化
const router = createRouter({
    // 表示使用什么路由
    history: createWebHashHistory(),
    // 表示路由的配置
    routes
})

/**
 * 1.如果去登录页且已经登录，则直接跳转第一个导航
 * 2.如果是首页，则直接跳转到第一个导航
 */
router.beforeEach(async (to) => {

    const isLogin = store.getters['user/isLogin']

    // 如果是去登录页且已经登录，则直接跳转第一个导航
    if (to.path === '/login') {
        if (isLogin) {
            console.log(store.state.firstRoute);
            return store.state.firstRoute
        }
        return true
    }

    if (store.state.routeLoaded) {
        return true
    }

    // 请求菜单数据
    await initMenu()
    const { state: { firstRoute } } = store
})

function initMenu() {

    return menuTree()
        .then((res) => {
            const { data } = res

            // 菜单/路由已经加载
            store.commit('setRouteLoaded', true)

            // 设置菜单数据
            store.commit('setMenuTree', data)

            // 设置访问首页时默认访问的页面
            store.commit('setFirstRoute', data[0].children.path)
        })
}


// 4.对外暴露出路由实例
export default router